<template>
  <view class="quote-section">
    <text class="quote-text">{{ quote.text }}</text>
    <text class="quote-author">—— {{ quote.author }}</text>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue';
// 名人名言模块
interface Quote {
  text: string;
  author: string;
}

const quotes: Quote[] = [
  { text: '那些杀不死你的，终将使你越来越强大！', author: '弗里德里希·尼采' },
];

const quote = ref<Quote>(quotes[Math.floor(Math.random() * quotes.length)]);

</script>

<style scoped>
.quote-section {
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 20px;
  text-align: center;
}

.quote-text {
  font-size: 16px;
  font-style: italic;
  color: #333;
}

.quote-author {
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: #666;
}
</style>